<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>添加元素enter</title>
    <script src="./js/d3.v3.min.js"></script>
    <script>
        window.onload = () => {


            // 数据的分类
            // 1：update() 和元素能够对应上的数据   update
            // 2：enter()  元素数量少，数据数量多，多出来的数据属于enter
            // 3：exit()   元素数量多，数据数量少，多出来的元素属于exit

            const arr = ["北京","上海","广州","深圳","西安"];

            const body  = d3.select("body");
            body.selectAll("p").data(arr)
                .enter()
                .append("p")
                .text(item => item)
        }
    </script>
</head>
<body>
    <p>兰州</p>
</body>
</html> 